<ui:composition 
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui"
    xmlns:f="http://java.sun.com/jsf/core">

    <p:dialog widgetVar="wvEdicionProducto" header="Actualización de productos" 
              id="dlgEdicionProducto" modal="true" width="30%" height="300">
        <h:form id="frmEdicionProducto">
            <!--            <p:growl id="msgEdicionProducto"/>-->
            <table cellspacing="7" class="colorTexto">
                <tr>
                    <td>
                        <h:outputText value="Código:" />
                    </td>
                    <td>
                        <p:inputText id="txtCodigo" value="#{productoMB.producto.codigo}" style="width: 90px"
                                     required="true" requiredMessage="Debe ingresar el código">
                            <p:watermark value="codigo" for="txtCodigo"/>
                        </p:inputText>
                    </td>
                </tr>
                <tr>
                    <td rowspan="2">
                        <h:outputText value="Producto:" />
                    </td>
                    <td>
                        <p:inputTextarea rows="5" cols="30" counter="display" value="#{productoMB.producto.descripcion}" 
                                         maxlength="250" counterTemplate="{0} caracteres restantes." autoResize="false" 
                                         required="true" requiredMessage="Debe ingresar la descripción del producto"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:outputText id="display" />
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:outputText value="Tipo:" />
                    </td>
                    <td>
                        <h:selectOneMenu style="width: 130px" id="lstOpcionTipoProd" value="#{productoMB.producto.tipoProducto.id}"
                                         required="true" requiredMessage="Debe seleccionar el tipo">          
                            <f:selectItem  itemLabel="--Seleccione--" itemValue="" />
                            <f:selectItems value="#{productoMB.opcionTipoProd}" var="t" 
                                           itemValue="#{t.id}" itemLabel="#{t.descripcion}"/>
                        </h:selectOneMenu>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:outputText value="Cantidad:" />
                    </td>
                    <td>
                        <p:inputText id="txtCantidad" value="#{productoMB.producto.cantidad}" style="width: 90px"
                                     required="true" requiredMessage="Debe ingresar la cantidad">
                            <p:watermark value="cantidad" for="txtCantidad"/>
                        </p:inputText>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:outputText value="Unid. medida:" />
                    </td>
                    <td>
                        <h:selectOneMenu style="width: 130px" id="lstOpcionUnidadMed" value="#{productoMB.producto.unidadMedida.id}"
                                         required="true" requiredMessage="Debe seleccionar el área">          
                            <f:selectItem  itemLabel="--Seleccione--" itemValue="" />
                            <f:selectItems value="#{productoMB.opcionUnidadMed}" var="op" 
                                           itemValue="#{op.id}" itemLabel="#{op.descripcion}"/>
                        </h:selectOneMenu>
                    </td>
                </tr>
                <tr>
                    <td>
                        <h:outputText value="Estado:" />
                    </td>
                    <td>
                        <h:selectOneMenu style="width: 150px" id="lstOpcionEstado" value="#{productoMB.producto.estado}"
                                         required="true" requiredMessage="Debe seleccionar el estado">          
                            <f:selectItem  itemLabel="--Seleccione--" itemValue="" />
                            <f:selectItem  itemLabel="Inactivo" itemValue="Inactivo" />
                            <f:selectItem  itemLabel="Activo" itemValue="Activo" />
                        </h:selectOneMenu>
                    </td>
                </tr>
                <tr style="height: 60px;">
                    <td colspan="4" align="center" style="padding-top: 4px">
                        <p:commandButton id="btnActualizar"
                                         icon="ui-icon-disk"
                                         value="Actualizar"
                                         update=":frmConfirmacionActualizacionProd"
                                         oncomplete="wvConfirmacionActualizacionProd.show()"/>
                    </td>
                </tr>
            </table>
        </h:form>
    </p:dialog>
    <p:confirmDialog widgetVar="wvConfirmacionActualizacionProd"  message="¿Confirma que desea actualizar producto #{productoMB.producto.codigo} ?" 
                     header="Confirmación" id="dlgConfirmacionActualizacionProd" severity="alert" >
        <h:form id="frmConfirmacionActualizacionProd">
            <p:growl id="msgEdicionProducto"/>
            <table align="center">
                <tr>
                    <td>
                        <p:commandButton id="btnAceptar" value="Aceptar"
                                         action="#{productoMB.actualizarProducto}"
                                         onstart="wvProcesando.show()"
                                         oncomplete="wvConfirmacionActualizacionProd.hide(),wvProcesando.hide()"
                                         update="msgEdicionProducto"/>
                        <p:commandButton id="btnCancelar" value="Cancelar" onclick="wvConfirmacionActualizacionProd.hide()" type="button" />
                    </td>
                </tr>
            </table>
        </h:form>
    </p:confirmDialog>
</ui:composition>
